$(function () {
  initArtCateList();
  //获取文章分类的列表
  function initArtCateList() {
    $.ajax({
      type: "GET", //默认get
      url: "/my/article/cates", //默认当前页
      success: function (res) {
        //请求成功回调
        if (res.status !== 0) return layui.layer.msg(res.message);
        var htmlStr = template("tpl-table", res);
        $("tbody").html(htmlStr);
      },
    });
  }

  // 为添加类别按钮绑定点击事件 点击就弹出添加分类的弹出层
  $("#btnAddCate").on("click", function () {
    layui.layer.open({
      type: 1,
      area: ["500px", "250px"],
      title: "添加文章分类",
      content: $("#dialog-add").html(),
    });
  });

  // 通过代理的形式，为添加分类里的表单 form-add表单绑定submit 事件
  // 发送post请求,把表单数据上传到服务器,然后再次调用渲染函数
  $("body").on("submit", "#form-add", function (e) {
    e.preventDefault();
    $.ajax({
      type: "POST", //默认get
      url: "/my/article/addcates", //默认当前页
      data: $(this).serialize(), //格式{key:value}
      success: function (res) {
        //请求成功回调
        // 失败就提示用户
        if (res.status !== 0) return layui.layer.msg(res.message);
        // 成功就重新获取文章分类的列表
        initArtCateList();
        layui.layer.closeAll(); //疯狂模式，关闭所有层
        layui.layer.msg(res.message);
      },
    });
  });

  // 删除文章
  $("body").on("click", ".btn-delete", function () {
    // 获取文章的id
    var id = $(this).attr("data-id");
    // 询问用户是否删除
    layer.confirm("确认删除?", { icon: 3, title: "提示" }, function (index) {
      $.ajax({
        method: "GET",
        url: "/my/article/deletecate/" + id,
        success: function (res) {
          console.log(res);
          if (res.status !== 0) {
            return layui.layer.msg("删除文章失败！");
          }
          layui.layer.msg("删除文章成功！");
          initArtCateList();
        },
      });

      layer.close(index);
    });
  });

  // 修改文章 点击编辑按钮展示修改文章分类的弹出层
  $("body").on("click", ".btn-edit", function () {
    // 弹出一个修改文章分类信息的层
    layui.layer.open({
      type: 1,
      area: ["500px", "250px"],
      title: "修改文章分类",
      content: $("#dialog-edit").html(),
    });

    // 获取到自定义属性的id
    var id = $(this).attr("data-id");
    // 发起请求获取对应ID分类的数据
    $.ajax({
      type: "GET", //默认get
      url: "/my/article/cates/" + id, //默认当前页
      success: function (res) {
        //请求成功回调
        //将数据显示到弹出层,用layui 里面的 form.val() 方法
        layui.form.val("form-edit", res.data);
      },
    });
  });

  // 更新文章分类的数据  给修改按钮注册表单提交事件
  $("body").on("submit", "#form-edit", function (e) {
    e.preventDefault();
    $.ajax({
      type: "POST", //默认get
      url: "/my/article/updatecate", //默认当前页
      data: $(this).serialize(), //获取到表单数据,把获取到的数据当作参数
      success: function (res) {
        //请求成功回调
        if (res.status !== 0) {
          return layui.layer.msg(res.message);
        }
        // 成功之后关闭当前弹出层,调用 获取文章分类函数,重新渲染文章列表
        layui.layer.closeAll(); //疯狂模式，关闭所有弹出层
        initArtCateList();
        layui.layer.msg(res.message);
      },
    });
  });
});
